$mianW:1200px;
$c99:#999999;
$activeC:#31c27c;
$no3:oringe;
$liPLR:17px;
$liH:38px;
$btnB:1px solid #c9c9c9;
a{
	color: #000;
	text-decoration: none;
}
ul{
	list-style: none;

}
.bgColor{

	background: url(../images/toplist.png) repeat-x;
	min-height: 300px;
	padding-top: 60px;
	width: 100%;
	.main{
		width: $mianW;
		margin: 0 auto;
		overflow: hidden;
	}
}
.left{
	float: left;
	width: 178px;
	height: 1060px;
	border: 1px solid #ebebeb;
	h3{
		display: block;
		width: 144px;
		height: 60px;
		line-height: 60px;
		font-weight: normal;
		border-bottom: 1px solid #ebebeb;
		margin: 0 auto;
	}
	ul{
		padding-top: 10px;
		padding-bottom: 20px;
		li{
			font-size: 14px;
			height: 38px;
			line-height: 38px;
			padding-left: $liPLR;
			padding-right: $liPLR;
			&:hover{
				color:$activeC;
				cursor: pointer;
			}
		};
		.firstLi{
			padding-top: 10px;
			height: 50px;
			line-height: 20px;
		};

	}
}

.list_right{
	float: left;
	width: 990px;
	min-height: 300px;
	padding-top: 18px;
	margin-left: 30px;
	h2{
		font-weight:400;
	}
	.btn{
		width: 100%;
		height: 40px;
		padding-top: 25px;
		a{
			display: inline-block;
			width: 124px;
			height: 38px;
			line-height: 38px;
			text-align: center;
			border: $btnB;
			background: #fff;
			border-radius: 4px;
			margin-right: 6px;
		}
		.playAll{
			background: $activeC;
			color: #fff;
			border: 1px solid $activeC;
			&:hover{
				background:#37ad74;
			};
		}
		.other{
			&:hover{
				background:#eee;
			};
		}

	}
	.listAll{
		width: 100%;
		min-height: 200px;
		padding-top: 20px;
		.topTitle{
			height:50px;
			background: #fbfbfd;
			li{
				width: 100%;
				height: 100%;
				line-height: 50px;
				span{
					color:$c99;
					display: inline-block;
					height: 100%;
					font-size: 14px;
				}
				.song{
					width: 573px;
					margin-left: 122px;
				}
				.singer{
					width: 207px;
				}
			}
		}
		.songList{
			min-height: 80px;
			width: 100%;
			.rankno3{
				color: red;
			}
			li{
				line-height: 80px;
				min-height: 80px;
				width: 100%;
				&:nth-child(even){
					background: #fbfbfd;
				}
				p{
					float: left;
				}
				.rank{
					display: inline-block;
					width: 122px;
					height: 80px;
					padding-left: 32px;
					.rankNum{
						font-size: 22px;
					}
					.rankAdd{
						line-height: 14px;
						display: inline-block;
						color: #9b9b9b;
						width: 34px;
						font-size: 10px;
						text-align: center;
						margin-left: 20px;
					}
				}
				.songDetail{
					width: 573px;
					height: 80px;
					line-height: 80px;
					.imgUrl{
						width: 70px;
						height: 70px;
						display: inline-block;
						padding-top: 5px;
						float: left;
						img{
							width: 100%;
						}
					}
					.songName{
						float: left;
						height: 80px;
						line-height: 80px;
						display: inline-block;
						margin-left: 20px;
						font-size: 14px;
						a{
							display: inline;
							&:hover{
								color:$activeC;
							};
						}
					}
				}
				.singerName{
					width: 207px;
					font-size: 14px;
					a{
						display: inline;
						&:hover{
							color:$activeC;
						};
					}
				}
				.singerTimes{
					font-size: 14px;
					color: #9f9f9f;
				}
			}
		}
	}
}
.paginationDiv{
	padding-top: 60px;
	text-align: center;
	.prev{
		margin-right: 10px;
		display: inline-block;
		width: 47px;
		height:50px;
		font-family: simsun;
		color: #a2a2a2;
		line-height: 50px;
		text-align: center;
		font-weight: bolder;
		&:hover{
			cursor:pointer;
			background: $activeC;
			color: #fff;
		};
	}
	.prevNone{
		display: none;
	}

	.pageNums{
		margin-right: 10px;
		color: #a2a2a2;
		line-height: 50px;
		display: inline-block;
		width: 47px;
		height:50px;
		&:hover{
			cursor:pointer;
			background: $activeC;
		};
	}
	.pageNumsNow{
		margin-right: 10px;
		color: #fff;
		line-height: 50px;
		background: $activeC;
		display: inline-block;
		width: 47px;
		height:50px;
		&:hover{
			cursor:pointer;
		};
	}
}